import { Fragment, useRef, useEffect } from 'react';
import {
  useDidShow,
  useDidHide,
  useReady,
  usePageScroll,
  usePullDownRefresh,
  useReachBottom,
  useAddToFavorites,
  useShareAppMessage,
  useShareTimeline,
  useResize,
  useTabItemTap,
  getCurrentInstance,
} from '@tarojs/taro';
import ModalContent from '@/components/ModalContent';

export default function pageHoc(Page) {
  return function genPage() {
    const pageRef = useRef<any>(null);

    useEffect(() => {
      pageRef.current?.onLoad?.(getCurrentInstance().router);
    }, []);

    useDidShow(() => {
      pageRef.current?.componentDidShow?.();
    });

    useDidHide(() => {
      pageRef.current?.componentDidHide?.();
    });

    useReady(() => {
      pageRef.current?.onReady?.();
    });

    usePullDownRefresh(() => {
      pageRef.current?.onPullDownRefresh?.();
    });

    usePageScroll((e) => {
      pageRef.current?.onPageScroll?.(e);
    });

    useReachBottom(() => {
      pageRef.current?.onReachBottom?.();
    });

    // @ts-ignore
    useAddToFavorites((e) => {
      pageRef.current?.onAddToFavorites(e);
    });

    // @ts-ignore
    useShareAppMessage((e) => {
      pageRef.current?.onShareAppMessage(e);
    });

    // @ts-ignore
    useShareTimeline(() => {
      pageRef.current?.onShareTimeline();
    });

    // @ts-ignore
    useResize((e) => {
      pageRef.current?.onResize(e);
    });

    useTabItemTap((e) => {
      pageRef.current?.onTabItemTap(e);
    });

    return (
      <Fragment>
        <ModalContent />
        <Page ref={pageRef} />
      </Fragment>
    );
  };
}
